<template>
  <div class="system">
    <el-dialog top="5vh" :visible.sync="visible">
      <div class="panelWrap">
        <div class="title flex flexac flexjcsb fs14 cfff fwb pl p-r-20">
          <div>维修结果</div>
          <i class="el-icon-close" @click="handleCloseDialogUpdate" />
        </div>

        <div class="flex flex-wrap">
          <div class="system-main">
            <el-table height="600" border id="dataList" ref="dataList" class="con-table" type="expand" :data="dataList" :span-method="arraySpanMethod">

              <el-table-column fixed align="center" label="组成部分">
                <template slot-scope="scope">
                  <span>{{ scope.row.part }}</span>
                </template>
              </el-table-column>

              <el-table-column align="center" label="部件名称">
                <template slot-scope="scope">
                  <span>{{ scope.row.child }}</span>
                </template>
              </el-table-column>

              <el-table-column prop="name" align="center" label="维修结果">
                <template slot-scope="scope">
                  <el-tag type="success" effect="dark">{{ scope.row.result ? '已维修' : '未维修' }}</el-tag>
                </template>
              </el-table-column>
            </el-table>

            <div class="flex flexac flextc footer m-t-40 m-b-40">
              <el-button class="btn clsoeBtn el-icon-circle-close" @click="handleCloseDialog">关 闭</el-button>
            </div>
          </div>
        </div>

      </div>
    </el-dialog>
  </div>
</template>

<script>
import { purchaseEnter, stockEnterUpdate, returnEnter } from '@/api/operation/BOM/opStockEnter'
import { showNotice } from '@/utils/toolclass'

export default {
  name: 'resultDialog',
  props: {
    value: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      visible: false,
      dataList: [
        {
          part: '曳引系统',
          child: '曳引机',
          result: true
        },
        {
          part: '曳引系统',
          child: '钢丝绳',
          result: true
        },
        {
          part: '曳引系统',
          child: '绳头组合',
          result: true
        },
        {
          part: '承载系统',
          child:'轿厢壁',
          result: true
        },
        {
          part: '承载系统',
          child:'底盘',
          result: true
        },
        {
          part: '承载系统',
          child:'轿厢顶',
          result: true
        },
        {
          part: '门系统',
          child:'厅门',
          result: true
        },
        {
          part: '门系统',
          child:'轿门',
          result: true
        },
        {
          part: '导向系统',
          child:'导向轮',
          result: true
        },
        {
          part: '导向系统',
          child:'导轨',
          result: true
        },
        {
          part: '导向系统',
          child:'导靴',
          result: true
        },
        {
          part: '导向系统',
          child:'导轨架',
          result: true
        },
        {
          part: '重量平衡系统',
          child:'对重架',
          result: true
        },
        {
          part: '重量平衡系统',
          child:'对重块',
          result: true
        },
        {
          part: '重量平衡系统',
          child:'平衡补偿装置',
          result: true
        },
        {
          part: '电气控制系统',
          child:'信号系统',
          result: true
        },
        {
          part: '电气控制系统',
          child:'控制系统',
          result: true
        },
        {
          part: '安全保护装置',
          child:'限速器及安全钳',
          result: true
        },
        {
          part: '安全保护装置',
          child:'缓冲器',
          result: true
        },
        {
          part: '安全保护装置',
          child:'开关系统',
          result: true
        },
        {
          part: '润滑系统',
          child:'加油杯',
          result: true
        },
      ],
    }
  },
  watch: {
    value(v) {
      this.visible = v
    }
  },
  mounted() {

  },
  methods: {
    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
      console.log(rowIndex)
      if (columnIndex === 0) {
        switch (rowIndex) {
          case 0:
            return {
              rowspan: 3,
              colspan: 1
            };
            break;
          case 3:
            return {
              rowspan: 3,
              colspan: 1
            };
            break;
          case 6:
            return {
              rowspan: 2,
              colspan: 1
            };
            break;
          case 8:
            return {
              rowspan: 4,
              colspan: 1
            };
            break;
          case 12:
            return {
              rowspan: 3,
              colspan: 1
            };
            break;
          case 15:
            return {
              rowspan: 2,
              colspan: 1
            };
            break;
          case 17:
            return {
              rowspan: 3,
              colspan: 1
            };
            break; 
          case 20:
            return {
              rowspan: 1,
              colspan: 1
            };
            break; 
          default:
            return {
              rowspan: 0,
              colspan: 0
            };
            break;
        }
      }
    },
    handleCloseDialog() {
      console.log('子组件关闭')
      this.$emit('handleCloseDialog')
    },
    handleCloseDialogUpdate() {
      this.$emit('handleCloseDialog')
    },
  }
}
</script>

<style lang="scss" scoped>
@import "@/styles/public.scss";
.sysName {
  width: 100px !important;
  text-align: right;
}
.com-input {
  flex: 1;
}
.el-tree-node .el-checkbox .el-checkbox__inner {
  display: block !important;
}
.flex-wrap {
  justify-content: space-around;
  padding: 0;
}
.tree-grow {
  width: 100%;
}
.system {
  height: 100%;
  .panelWrap {
    width: 800px;
    margin-left: -140px;
    background: #ffffff;
    .system-main {
      width: 100%;
      .system-form {
        .coInput {
          width: 240px;
        }
        .coLogoInput {
          width: 360px;
        }
        .sys-nameBox {
          .sysName {
          }
          .sysName-input {
          }
        }
        .shorterForm {
          .short-name {
          }
          .short-input {
          }
        }
        .sysPlatform {
          .platform-name {
          }
          .platform-select {
          }
        }
        .sysWechat {
          .isWechat {
          }
          .isWechat-select {
          }
        }
        .preview {
          .preview-text {
            vertical-align: top;
          }
          .editLogo {
            border: 1px solid rgba(225, 225, 225, 0.5);
            width: 240px;
            height: 150px;
            border-radius: 5px;
            .image-slot {
              width: 100%;
              height: 100%;
              border-radius: 5px;
              background: #eeeeee;
              .errorImg {
                width: 60px;
                height: 60px;
                margin: 40px 0 0 90px;
              }
            }
          }
        }
        .system-logo {
          margin-left: 140px;
          .log {
          }
          .logo-input {
          }
        }
        .system-entry {
          margin-left: 130px;
          .entry {
          }
          .entry-input {
          }
        }
      }
      .footer {
        .btn {
          width: 100px;
          height: 40px;
        }
      }
    }
  }
}
// .panelWrap {
//   .el-form {
//     margin: 0 auto;
//   }
//   .input {
//     justify-content: center;
//   }
//   .input1 {
//     margin-left: -120px;
//   }
//   .input2 {
//     margin-left: -60px;
//   }
//   .name {
//     width: 102px;
//   }
//   .sysName {
//     width: 194px;
//   }
//   .sysWechat {
//     width: 100%;
//     .isWechat {
//       width: 130px;
//       margin-left: -8px;
//     }
//   }
//   .entry {
//     width: 200px;
//   }
//   .sysLink {
//     width: 400px;
//   }
// .clsoeBtn,.saveBtn {
//   width: 100px;
//   height: 40px;
// }
// .el-button+.el-button {
//   margin-left: 30px;
// }
// .errorBox {
//   width: 100%;
//   height: 100%;
//   border-radius: 5px;
//   background: #eeeeee;
//   .errorImg {
//     width: 60px;
//     height: 60px;
//     margin: 45px 0 0 70px;
//   }
// }
// .editLogo {
//     border: 1px solid rgba(225,225,225,.5);
//     width: 200px;
//     height: 150px;
//     border-radius: 5px;
//   }
// }
</style>
